[2025-07-10] DOM-XSS

🦥 본문

• app.py

#!/usr/bin/python3
from flask import Flask, request, render_template
from selenium import webdriver
from selenium.webdriver.chrome.service import Service
import urllib
import os

app = Flask(__name__)
app.secret_key = os.urandom(32)
nonce = os.urandom(16).hex()

try:
    FLAG = open("./flag.txt", "r").read()
except:
    FLAG = "[**FLAG**]"

def read_url(url, cookie={"name": "name", "value": "value"}):
    cookie.update({"domain": "127.0.0.1"})
    try:
        service = Service(executable_path="/chromedriver")
        options = webdriver.ChromeOptions()
        for _ in [
            "headless",
            "window-size=1920x1080",
            "disable-gpu",
            "no-sandbox",
            "disable-dev-shm-usage",
        ]:
            options.add_argument(_)
        driver = webdriver.Chrome(service=service, options=options)
        driver.implicitly_wait(3)
        driver.set_page_load_timeout(3)
        driver.get("http://127.0.0.1:8000/")
        driver.add_cookie(cookie)
        driver.get(url)
    except Exception as e:
        driver.quit()
        # return str(e)
        return False
    driver.quit()
    return True

def check_xss(param, name, cookie={"name": "name", "value": "value"}):
    url = f"http://127.0.0.1:8000/vuln?param={urllib.parse.quote(param)}#{name}"
    return read_url(url, cookie)

@app.after_request
def add_header(response):
    global nonce
    response.headers['Content-Security-Policy'] = f"default-src 'self'; img-src https://dreamhack.io; style-src 'self' 'unsafe-inline'; script-src 'self' 'nonce-{nonce}' 'strict-dynamic'"
    nonce = os.urandom(16).hex()
    return response

@app.route("/")
def index():
    return render_template("index.html", nonce=nonce)

@app.route("/vuln")
def vuln():
    param = request.args.get("param", "")
    return render_template("vuln.html", nonce=nonce, param=param)

@app.route("/flag", methods=["GET", "POST"])
def flag():
    if request.method == "GET":
        return render_template("flag.html", nonce=nonce)
    elif request.method == "POST":
        param = request.form.get("param")
        name = request.form.get("name")
        if not check_xss(param, name, {"name": "flag", "value": FLAG.strip()}):
            return f'<script nonce={nonce}>alert("wrong??");history.go(-1);</script>'

        return f'<script nonce={nonce}>alert("good");history.go(-1);</script>'

memo_text = ""

@app.route("/memo")
def memo():
    global memo_text
    text = request.args.get("memo", "")
    memo_text += text + "\n"
    return render_template("memo.html", memo=memo_text, nonce=nonce)

app.run(host="0.0.0.0", port=8000)

• vuln.html

<script nonce={{ nonce }}>
  window.addEventListener("load", function() {
    var name_elem = document.getElementById("name");
    name_elem.innerHTML = `${location.hash.slice(1)} is my name !`;   });
</script>
  {{ param | safe }}
  <pre id="name"></pre>

• 기본적인 구성은 이전의 문제들과 비슷하지만 모르는 코드들이 생겼다.
  • @app.after_request : 데코레이터로 모든 요청을 처리한 후 response 객체에 특정 처리를 할 때 사용
  • nonce : number used once로 한 번만 쓰이는 고유한 값. <script nonce={{ nonce }}>에 집어넣고 응답 헤더에도 집어 넣어서 cli에 보냄. 브라우저에서 nonce 비교 후 값이 같으면 인라인 스크립트를 안전하다고 판단 후 실행함. 이벤트 핸들러에도 적
  • 인라인 스크립트 : HTML 문서 안에
  • location.hash : URL에서 #과 그 이후의 값.

  • {{ param

    safe }} : Jinja2 템플릿 문법과 HTML 요소가 섞인 요소

    • 예를 들면 <p>{{ param }}</p> 에 <b>Hello!</b>을 넣으면 실제 화면에는 보안상의 이유로 <b>Hello!</b> 그대로 나타남. 굵게 나타나지 않고 텍스트 그대로 나타남

    • {{ param

      safe }}을 하면 안전하다고 판단하여 굵은 글씨의 Hello!가 나타남

• CSP에 대해서 더 알아볼 필요가 있었다.

풀이

1. param에는 를 먼저 넣는다. 실행 시킬 JS 코드가 없어서 nonce를 벗어날 수 있었다.
2. name에는 location.href=’/memo?memo=’+document.cookie//를 넣어서 innerHTML을 통해 param으로 넣은 스크립트 문에 넣는다. 동적으로 이미 있는 스크립트에 코드를 변경한 것으로 nonce를 피할 수 있다.